<template>
	<view>
		<view class='order-list-box'>
			<scroll-view scroll-y @scrolltolower="loadMore">
				<view class='order-list'  v-for="(item,index) in orderData" :key="index">
					<view class='order-status order-common'>
						{{item.order_state_text}}
					</view>
					<view class='order-common order-mer'>广东恒朗</view>
					<view class='good'>
						<view class='lease content-box'>
							<navigator open-type="navigate" :url="'/pages/jewel/order/orderdetail?order_id='+item.id">
								<view class='lease-img'>
									<image :src='item.goods_img'></image>
								</view>
								<view class='lease-info'>
									<view class='lease-title'>{{item.goods_name}}</view>
									<view class='lease-attr font-color-hs'>{{item.item_names}}</view>
								</view>
								<view class='lease-price'>
									<view class='lease-now'>¥{{item.shop_price}}</view>
									<view class='lease-num font-color-hs'>x{{item.buy_num}}</view>
								</view>
							</navigator>
						</view>
					</view>
					<view class='order-handle-box'>
						<view v-if="item.shop_price!=null">
							<view class='order-handle' @tap='cancel_consignation(item.id, 1)'>取消寄存</view>
						</view>
						<view class='order-handle' @tap='go_keep_detail(item.order_no)'>查看寄存</view>
					</view>
				</view>
			</scroll-view>
		</view>
		<view class="m-loading" v-if="bIsShowLoading">
		    <image src="../../../static/images/loading.gif" mode="widthFix"></image>
		    <text>加载中</text>
		</view>
		<view class="m-no-data" v-if="showNodata">
			<image src="../../../static/images/no_order.png" mode="widthFix"></image>
		</view>
	</view>
</template>

<script>
	import hl from '@/common/common_zb.js';
	export default {
		data() {
			return {
				page: 1,	// 当前页数
				totalPages: 1,	// 页数总数
				orderData: [],	// 订单数据
				loadtype: 'normal',	// 加载数据方式
				bIsShowLoading: false,
				showNodata: false,
			}
		},
		onLoad() {
			this.get_order_list({type: 9});
		},
		// 下拉刷新
		onPullDownRefresh(){
			this.firstLoad();
		},
		// 上拉加载
		onReachBottom(){
			this.loadMore()
		},
		methods: {
			firstLoad() {
				this.page = 1;
				this.totalPages = 1;
				this.loadtype = 'normal';
				this.get_order_list({type: 9});
			},
			// 获取订单列表			
			get_order_list(data){
				let that = this;
				that.bIsShowLoading = true;
				if(that.page <= that.totalPages){
					data.page = that.page;
					hl.post('order/get_order_list',data,false,function(res){
						that.bIsShowLoading = false;
						if(res.data.total_pages == 0) {
							that.showNodata = true;
						}
						if (!res.data.data.length) {
							that.orderData = ''
							return false;
						}
						if (that.loadtype == "plus") { // 上拉加载
							that.orderData = that.orderData.concat(res.data.data);
						} else {
							that.orderData = res.data.data;
							that.totalPages = res.data.total_pages;
							uni.stopPullDownRefresh();
						}
					});
				}else{
					that.bIsShowLoading = false
				}
			},
			go_keep_detail(order_no) {
				uni.navigateTo({
					url: '/pages/jewel/agent_jewel/keep_detail?order_no=' + order_no
				})
			},
			cancel_consignation(order_id, type) {
				let that = this;
				if(type == 1) {
					uni.showModal({
						title: '提示',
						content: '确认要取消寄存该订单吗',
						success: function (res) {
							if (res.confirm) {
								hl.post('order/cancel_consignation', {order_id: order_id}, true, function (res){
									let resdata = res.data;
									if(resdata.code == '0') {
										hl.showToast(resdata.msg);
										that.firstLoad();
									}else if(resdata.code == 2) {
										uni.showModal({
											title: '提示',
											content: resdata.msg,
											success: function (res) {
												if (res.confirm) {
													that.cancel_consignation(order_id, 2);
												}
											}
										})
									}else{
										hl.showToast(resdata.msg);
									}
								})
							}
						}
					})
				}else{
					hl.post('order/cancel_consignation', {order_id: order_id, toast: 1}, true, function (res){
						let resdata = res.data;
						hl.showToast(resdata.msg);
						if(resdata.code == '0') {
							that.firstLoad();
						}
					})
				}
			},
			loadMore(){
				this.page++;
				this.loadtype = 'plus';
				this.get_order_list({type: 9, page: this.page});
			}
		}
	}
</script>
<style>
	.order-tab-box {
		height: 90rpx;
		width: 100%;
		background: #f8f8f8;
		display: flex;
		display: -webkit-flex;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 9;
	}

	.order-tab {
		height: 100%;
		line-height: 90rpx;
		flex: 1;
		-webkit-flex: 1;
		text-align: center;
		font-size: 30rpx;
		color: #666
	}

	.order-tab-current {
		color: #bea374;
		height: 88rpx;
		border-bottom: 1rpx solid #bea374;
		width: auto;
	}

	.order-list-box {
		width: 100%;
		height: 100%;
		overflow: hidden;
	}

	.order-list {
		width: 95%;
		height: 489rpx;
		border: 2rpx solid #ececec;
		background: #fff;
		margin: 0 auto;
		margin-top: 14rpx;
		position: relative;
	}
	.product_down{
		background-image: url('~@/static/images/jewel/product_down.png');
		background-size: 100%;
		background-repeat: no-repeat;
		width: 135rpx;
		height: 135rpx;
		position: absolute;
		right: 0rpx;
		top: 0rpx;
	}
	.order-common {
		height: 84rpx;
		width: 100%;
		background: #f6f6f6;
		line-height: 84rpx;
		font-size: 28rpx;
		color: #bea374;
		text-indent: 22rpx;
		border-bottom: 1rpx solid #ececec
	}

	.order-mer {
		background: #fff;
		color: #3c3c3c;
		height: 97rpx;
		line-height: 97rxp;
	}

	.good {
		height: 200rpx;
		overflow: hidden;
		border-bottom: 1px solid #ddd;
		margin-top: 30rpx;
	}

	.lease {
		height: 100%;
		overflow: hidden;
		width: 95%;
		margin: 0 auto;
	}

	.lease-img {
		float: left;
		width: 144rpx;
		height: 144rpx;
		border: 1rpx solid #c8c8c8;
		margin-right: 21rpx;
	}

	.lease-img image {
		width: 100%;
		height: 100%
	}

	.lease-info {
		width: 370rpx;
		float: left;
		font-size: 26rpx;
		overflow: hidden;
	}

	.lease-title {
		height: 76rpx;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
	}

	.lease-attr {
		height: 68rpx;
		overflow: hidden;
		font-size: 24rpx;
		margin-top: 10rpx;
	}

	.lease-price {
		float: right;
		font-size: 26rpx;
	}

	.lease-num {
		margin-top: 14rpx;
	}

	.lease-market-price {
		text-decoration: line-through;
	}

	.lease-now {
		color: #666
	}

	.font-color-hs {
		color: #999;
	}

	.order-handle-box {
		height: 75rpx;
		width: 100%;
		font-size: 26rpx;
	}

	.order-handle {
		height: 50rpx;
		width: auto;
		padding: 0 15rpx;
		border: 1rpx solid #999;
		text-align: center;
		line-height: 50rpx;
		border-radius: 5rpx;
		color: #6c6c6c;
		float: right;
		margin-right: 20rpx;
		margin-top: 13rpx;
	}

	.dopay {
		color: #fff;
		background: linear-gradient(to right, #f3587c, #ff7d5d);
		border: none;
		height: 53rpx;
		line-height: 52rpx;
	}

	.order-apply {
		display: inline-block;
		color: green
	}
	.m-no-data image{
		width: 100%;
		height: 100%;
	}
</style>
